import {createRouter,createWebHashHistory} from 'vue-router'

// 1. Define route components.
// These can be imported from other files
import News from "../components/News.vue";
import NotFound from "../components/NotFound.vue";
import Home from "../components/Home.vue";
import Article from "../components/Article.vue";
import Films from "../components/Films.vue";


// 2. Define some routes
// Each route should map to a component.
// We'll talk about nested routes later.
const routes = [
    {path: '/', component: Home},
    // 动态路由
    {path: '/news/:id', component: News},
    {path: '/article/:id(\\d+)', component: Article},
    // + 至少有一个 * 可以省略
    // ? 不可重复
    {path: '/films/:id*', component: Films},
    // {path: '/about', component: About},

    // 正则匹配路由
    {path: '/:path(.*)', component: NotFound},
]

// 3. Create the router instance and pass the `routes` option
// You can pass in additional options here, but let's
// keep it simple for now.
const router = createRouter({
    // 4. Provide the history implementation to use. We are using the hash history for simplicity here.
    history: createWebHashHistory(),
    routes // short for `routes: routes`
})

export default router;

// // 5. Create and mount the root instance.
// const app = Vue.createApp({})
// // Make sure to _use_ the router instance to make the
// // whole app router-aware.
// app.use(router)
//
// app.mount('#app')

// Now the app has started!